// SPDX-License-Identifier: GPL-3.0-or-later

import QtQuick
import Fk
import Fk.Components.Common
import Fk.Components.LunarLTK
import Fk.Components.LunarLTK.Photo as DefaultPhoto

Rectangle {
  id: root
  // spacing: 2
  property int maxValue: 5
  property int value: 5
  property var colors: ["#e90000", "#e92222", "#e97422", "#c3c322", "#8dc322", "#42ae22"]
  property int shieldNum: 0

  color: "black"
  width: 14
  height: {
    let v = maxValue;
    if (v > 5 || v > 4 && shieldNum > 0) v = 3.6;
    return 14 * Math.min(v, 5) + 2;
  }

  Rectangle {
    id: topCorner
    property int bar_raidus: 4
    width: bar_raidus * 2
    height: bar_raidus * 2
    color: parent.color
    radius: bar_raidus
    anchors.left: parent.left
    y: - bar_raidus
  }

  Rectangle {
    property int bar_raidus: topCorner.bar_raidus
    width: parent.width - bar_raidus
    height: topCorner.height
    anchors.top: topCorner.top
    anchors.left: topCorner.right
    anchors.leftMargin: - bar_raidus
    color: parent.color
  }

  Column {
    anchors.bottom: parent.bottom
    anchors.bottomMargin: 3
    x: 1

    DefaultPhoto.Shield {
      id: shield
      value: shieldNum
      x: -2
    }

    Repeater {
      id: repeater
      model: column.visible ? 0 : maxValue
      Magatama {
        state: {
          if (maxValue - 1 - index >= value) {
          // 致敬一下神杀反着扣血
          // if (index >= value) {
            return 0;
          }
          return root.getState();
        }
      }
    }

    Column {
      id: column
      visible: maxValue > 5 || value > maxValue ||
      (shieldNum > 0 && maxValue > 4)
      spacing: -4

      Magatama {
        state: root.getState();
      }

      Text {
        id: hpItem
        width: root.width - 2
        text: value
        color: {
          const idx = root.getState();
          return root.colors[idx];
        }
        font.family: Config.libianName
        font.pixelSize: 16
        font.letterSpacing: -1
        font.bold: true
        horizontalAlignment: Text.AlignHCenter
        anchors.horizontalCenter: parent.horizontalCenter
      }

      Text {
        // id: splitter
        height: 12
        width: root.width - 2
        text: "/"
        z: -10
        rotation: 40
        color: hpItem.color
        font.family: Config.libianName
        font.pixelSize: 14
        font.bold: true
        horizontalAlignment: hpItem.horizontalAlignment
        anchors.horizontalCenter: parent.horizontalCenter
      }

      Text {
        id: maxHpItem
        width: root.width - 2
        text: maxValue
        color: hpItem.color
        font: hpItem.font
        horizontalAlignment: hpItem.horizontalAlignment
        anchors.horizontalCenter: parent.horizontalCenter
      }
    }
  }

  function getState() {
    if (value == maxValue) return 5;
    return Math.max(0, Math.min(5, value));
  }
}
